defines a form input or control
<form method="post" action="process.php">
Your name: <input type="text" name="username">
<input type="submit">
</form><input> is used to define input fields and other controls within a <form>. There are many types of inputs, from simple textfields to checkboxes and buttons.
Note: This is an empty element; it has no closing tag. In XHTML documents, the <input /> syntax is recommended.
| Attribute | Description | Values |
|---|---|---|
| Element Attributes | ||
| accept | allowed MIME types for uploads | |
| align | how to align the enclosed content |
|
| alt | alternate text for an input with type=image | |
| autocomplete | whether browser may store the form's input values |
|
| autofocus | focus this input on page load | |
| checked | radio button or checkbox will be on by default on page load | |
| disabled | if present, disables control | |
| form | name of the form the input belongs to | |
| formaction | overrides the form's action attribute | |
| formenctype | overrides the form's enctype attribute | |
| formmethod | overrides the form's method attribute | |
| formnovalidate | overrides the form's novalidate attribute | |
| formtarget | overrides the form's target attribute | |
| list | id of a related | |
| max | maximum value | |
| maxlength | if text input, maximum number of characters | |
| min | minimum value | |
| multiple | if present, user may provide more than one value | |
| name | unique name for input | |
| pattern | a JavaScript regex pattern which the value must match | |
| placeholder | placeholder text when no value specified | |
| readonly | if present, input value can't be edited | |
| required | if present, value is required to submit form | |
| size | number of characters visible | |
| src | for image inputs, URL of image | |
| step | granularity of value steps | |
| type | type of input |
|
| value | initial value for input | |
| width | pixel or percentage width of input field | |
| Standard Attributes | ||
| accesskey | defines a key used to focus the element | |
| class | class of this element | |
| contenteditable | whether element is user editable | |
| contextmenu | specifies a menu that corresponds to this element | |
| dir | text direction | |
| draggable | whether element is draggable | |
| hidden | whether element should be displayed | |
| id | unique identifier for this element | |
| itemprop | defines a microdata property of the element in the item. | |
| itemscope | creates a microdata group for the element | |
| lang | language used within element | |
| spellcheck | whether spellchecking is enabled for this element | |
| style | CSS styling rules | |
| subject | associates a microdata property with a non-parent item | |
| tabindex | defines tab key navigation ordering for the element | |
| title | title of this element | |
| translate | whether translation tools should translate the element's content | |
| xml:lang | language used within element | |
| Handler | Description | |
|---|---|---|
| Event Handlers | ||
| onchange | run when an element changes | |
| onclick | run when element is clicked | |
| oncontextmenu | run when contextual menu is triggered | |
| ondblclick | run when element is double-clicked | |
| ondrag | run when element is dragged | |
| ondragend | run at end of a drag operation | |
| ondragenter | run when element has been dragged to a valid drop target | |
| ondragleave | run when element leaves a valid drop target | |
| ondragover | run while element is over a valid drop target | |
| ondragstart | run at start of drag operation | |
| ondrop | run when dragged element is dropped | |
| onfocus | run when element receives focus | |
| onformchange | run when form changes | |
| onforminput | run when form gets input | |
| oninput | run when element gets user input | |
| oninvalid | run when element is invalid | |
| onkeydown | run when a key gets pressed | |
| onkeypress | run when a key gets pressed then released | |
| onkeyup | run when a pressed key is released | |
| onmousedown | run when mouse button gets pressed | |
| onmousemove | run when the mouse pointer moves | |
| onmouseout | run when the mouse pointer leaves the element | |
| onmouseover | run when the mouse pointer enters the element | |
| onmouseup | run when a pressed mouse button is released | |
| onmousewheel | run when the mouse wheel is used | |
| onreset | run when a form reset is performed | |
| onscroll | run when element is being scrolled | |
| onselect | run when element is selected | |
| onsubmit | run when form is submitted | |
| Media Event Handlers | ||
| onabort | run when media resource loading is aborted | |
| oncanplay | run when media can start to play | |
| oncanplaythrough | run when media can be played completely to its end | |
| ondurationchange | run when duration of media has changed | |
| onemptied | run when a media resource becomes empty | |
| onended | run when media playback reaches end | |
| onerror | run when an error occurs during element loading | |
| onloadeddata | run when media resource is loaded | |
| onloadedmetadata | run when media metadata is loaded | |
| onloadstart | run when media resource has started to load | |
| onpause | run when media resource is paused | |
| onplay | run when media resource will start playing | |
| onplaying | run when media resource is playing | |
| onprogress | run when browser has received additional media resource data | |
| onratechange | run when media resource playback rate changes | |
| onreadystatechange | run when media resource ready state changes | |
| onseeked | run after media resource seeking operation has been performed | |
| onseeking | run during media resource seeking operation | |
| onstalled | run when media resource loading has stalled | |
| onsuspend | run when browser stops fetching media resource before finished | |
| ontimeupdate | run when media resource playback position changes | |
| onvolumechange | run when media resource volume is changed or muted | |
| onwaiting | run when media resource has stopped playing but expects to resume | |